payments fixes

13 files changed, 89 insertions, 74 deletions

diff --git a/src/routes/(app)/[username]/(profile)/+layout.svelte b/src/routes/(app)/[username]/(profile)/+layout.svelte
index ed8a90f3..331161bb 100644
--- a/src/routes/(app)/[username]/(profile)/+layout.svelte
+++ b/src/routes/(app)/[username]/(profile)/+layout.svelte
@@ -51,16 +51,16 @@
 	<div class="w-[240px] lg:absolute space-y-5 left-20 mx-auto lg:mr-10">
 		<h1 class="text-3xl font-bold text-center mx-auto">{display || username}</h1>
 
-    {#if subject.address}
-		<div
-			class="text-secondary mx-auto text-center lg:text-left lg:mx-0"
-			class:line-clamp-3={hideBio}
-			on:click={toggleBio}
-      on:keydown={toggleBio}
-		>
-    {subject.address}
-		</div>
-    {/if}
+		{#if subject.address}
+			<div
+				class="text-secondary mx-auto text-center lg:text-left lg:mx-0"
+				class:line-clamp-3={hideBio}
+				on:click={toggleBio}
+				on:keydown={toggleBio}
+			>
+				{subject.address}
+			</div>
+		{/if}
 
 		<div class="flex justify-around">
 			<a href={`/${subject.pubkey}/follows`}
diff --git a/src/routes/(app)/[username]/(profile)/+page.svelte b/src/routes/(app)/[username]/(profile)/+page.svelte
index 2de58873..84aa4425 100644
--- a/src/routes/(app)/[username]/(profile)/+page.svelte
+++ b/src/routes/(app)/[username]/(profile)/+page.svelte
@@ -95,7 +95,9 @@
 
 			<div class="flex flex-wrap gap-4 justify-center w-full">
 				<a href={`/${user.username}/receive`} class="w-full md:w-60">
-					<button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60">
+					<button
+						class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60"
+					>
 						<div class="mx-auto flex">
 							<Icon icon="numpad" style="my-auto h-6 mr-2" />
 							<div class="my-auto mt-1">{$t('user.requestPayment')}</div>
@@ -103,7 +105,9 @@
 					</button>
 				</a>
 				<a href={`/scan`} class="w-full md:w-60">
-					<button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60">
+					<button
+						class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60"
+					>
 						<div class="mx-auto flex">
 							<Icon icon="scan" style="my-auto h-6 mr-2" />
 							<div class="my-auto mt-1">{$t('user.send.scan')}</div>
diff --git a/src/routes/(app)/[username]/card/[serial]/+page.svelte b/src/routes/(app)/[username]/card/[serial]/+page.svelte
index aee3be28..afdaf65d 100644
--- a/src/routes/(app)/[username]/card/[serial]/+page.svelte
+++ b/src/routes/(app)/[username]/card/[serial]/+page.svelte
@@ -6,30 +6,30 @@
 </script>
 
 <div class="space-y-5">
-<div class="relative flex justify-center gap-2">
-	<h1 class="text-2xl md:text-3xl font-semibold my-auto">Card {serial}</h1>
-</div>
-<div class="flex justify-center">
-	<a href={`/send/pot/${serial}`}>
-		<button
-			class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-60 bg-black text-white justify-center gap-2"
-		>
-			<svg
-				xmlns="http://www.w3.org/2000/svg"
-				class="invert text-black peer-placeholder-shown:text-gray-300 h-6 w-6 my-auto"
-				fill="none"
-				viewBox="0 0 24 24"
-				stroke="currentColor"
+	<div class="relative flex justify-center gap-2">
+		<h1 class="text-2xl md:text-3xl font-semibold my-auto">Card {serial}</h1>
+	</div>
+	<div class="flex justify-center">
+		<a href={`/send/pot/${serial}`}>
+			<button
+				class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-60 bg-black text-white justify-center gap-2"
 			>
-				<path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"
-				/>
-			</svg>
-			<div class="my-auto">Add Funds</div>
-		</button>
-	</a>
-</div>
+				<svg
+					xmlns="http://www.w3.org/2000/svg"
+					class="invert text-black peer-placeholder-shown:text-gray-300 h-6 w-6 my-auto"
+					fill="none"
+					viewBox="0 0 24 24"
+					stroke="currentColor"
+				>
+					<path
+						stroke-linecap="round"
+						stroke-linejoin="round"
+						stroke-width="2"
+						d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"
+					/>
+				</svg>
+				<div class="my-auto">Add Funds</div>
+			</button>
+		</a>
+	</div>
 </div>
diff --git a/src/routes/(app)/[username]/generate/+page.svelte b/src/routes/(app)/[username]/generate/+page.svelte
index 33bf64c4..b9274434 100644
--- a/src/routes/(app)/[username]/generate/+page.svelte
+++ b/src/routes/(app)/[username]/generate/+page.svelte
@@ -14,10 +14,10 @@
 	let gen = async () => {
 		if (!browser) return;
 
-    if (user.pubkey) {
-      goto($loginRedirect || `/${user.username}`, { invalidateAll: true });
-      return;
-    } 
+		if (user.pubkey) {
+			goto($loginRedirect || `/${user.username}`, { invalidateAll: true });
+			return;
+		}
 
 		if (!$password) $passwordPrompt = true;
 
diff --git a/src/routes/(app)/[username]/invoice/[id]/+page.svelte b/src/routes/(app)/[username]/invoice/[id]/+page.svelte
index 508550ba..2d204255 100644
--- a/src/routes/(app)/[username]/invoice/[id]/+page.svelte
+++ b/src/routes/(app)/[username]/invoice/[id]/+page.svelte
@@ -101,12 +101,12 @@
 
 	let toggleType = async () => {
 		invoice.type = invoice.type === types.lightning ? types.bitcoin : types.lightning;
-		({ hash } = await post(`/${username}/invoice`, {
+		({ id } = await post(`/${username}/invoice`, {
 			invoice,
 			user: { username, currency }
 		}));
 
-		goto(`./${hash}`, { invalidateAll: true });
+		goto(`./${id}`, { invalidateAll: true });
 	};
 </script>
 
diff --git a/src/routes/(app)/[username]/map/+page.svelte b/src/routes/(app)/[username]/map/+page.svelte
index b5e4dfad..99c822d3 100644
--- a/src/routes/(app)/[username]/map/+page.svelte
+++ b/src/routes/(app)/[username]/map/+page.svelte
@@ -1,6 +1,6 @@
 <script>
-  import { LocationsMap } from "$comp";
-  export let data;
+	import { LocationsMap } from '$comp';
+	export let data;
 
 	let { locations } = data;
 </script>
diff --git a/src/routes/(app)/[username]/payments/[...page]/+page.server.js b/src/routes/(app)/[username]/payments/[...page]/+page.server.js
index cb94d71d..a3b0ad6f 100644
--- a/src/routes/(app)/[username]/payments/[...page]/+page.server.js
+++ b/src/routes/(app)/[username]/payments/[...page]/+page.server.js
@@ -2,7 +2,9 @@ import { get, auth } from '$lib/utils';
 
 let limit = 25;
 
-export async function load({ cookies, params, request }) {
+export async function load({ cookies, depends, params, request }) {
+	depends('app:payments');
+
 	let parts = params.page.split('/');
 
 	let start, end, page;
diff --git a/src/routes/(app)/[username]/payments/[...page]/+page.svelte b/src/routes/(app)/[username]/payments/[...page]/+page.svelte
index 69f51f37..2ea225ad 100644
--- a/src/routes/(app)/[username]/payments/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/payments/[...page]/+page.svelte
@@ -2,7 +2,7 @@
 	import { Avatar, Icon } from '$comp';
 	import { onMount } from 'svelte';
 	import { format } from 'date-fns';
-	import { newPayment, payments } from '$lib/store';
+	import { newPayment } from '$lib/store';
 	import { t } from '$lib/translations';
 	import { get, f, s, sat, sats, types } from '$lib/utils';
 	import { page } from '$app/stores';
@@ -11,7 +11,7 @@
 
 	export let data;
 
-	let { start, end, user, rates } = data;
+	let { start, end, user, rates, payments } = data;
 
 	let change = ({ target: { value } }) => goto(value);
 	let link = (p) => {
@@ -34,7 +34,7 @@
 	let p,
 		totals,
 		pages = [];
-	$: data && ({ page: p, pages, start, end, totals, payments: $payments } = data);
+	$: data && ({ page: p, pages, start, end, totals, payments } = data);
 
 	$: $page && ($newPayment = false);
 	$: $newPayment && invalidate(`/users/${user.username}`);
@@ -136,7 +136,7 @@
 		</div>
 
 		<div class="text-base">
-			{#each $payments as p}
+			{#each payments as p}
 				<a href={`/payment/${p.id}`}>
 					<div class="grid grid-cols-3 border-b h-24 hover:bg-gray-100 px-4">
 						<div class="whitespace-nowrap my-auto">
@@ -216,7 +216,7 @@
 		</div>
 
 		<div class="grid grid-cols-3 w-full text-center">
-      <span class="text-lg text-secondary">{$t('payments.total')}</span>
+			<span class="text-lg text-secondary">{$t('payments.total')}</span>
 			<span class="text-lg text-secondary">{$t('payments.presentValue')}</span>
 			<span class="text-lg text-secondary">{$t('payments.gainLoss')}</span>
 
@@ -226,7 +226,9 @@
 				{@const gain = (pv * 100) / total - 100}
 				<span class="text-lg"><b>{f(total, c)}</b></span>
 				<span class="text-lg"><b>{f(pv, c)}</b></span>
-				<span class="text-lg" class:text-red-800={gain < 0}><b>{Math.abs(gain).toFixed(2)}%</b></span>
+				<span class="text-lg" class:text-red-800={gain < 0}
+					><b>{Math.abs(gain).toFixed(2)}%</b></span
+				>
 			{/each}
 		</div>
 
diff --git a/src/routes/(app)/[username]/receive/[...param]/+page.svelte b/src/routes/(app)/[username]/receive/[...param]/+page.svelte
index a97dc776..d7001079 100644
--- a/src/routes/(app)/[username]/receive/[...param]/+page.svelte
+++ b/src/routes/(app)/[username]/receive/[...param]/+page.svelte
@@ -5,7 +5,6 @@
 	import { page } from '$app/stores';
 	import { requestRedirect } from '$lib/store';
 	import { browser } from '$app/environment';
-	import { goto } from '$app/navigation';
 
 	export let data;
 	let type = 'lightning';
diff --git a/src/routes/(app)/[username]/settings/[...tab]/+page.svelte b/src/routes/(app)/[username]/settings/[...tab]/+page.svelte
index 842c2eba..762e836e 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/+page.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/+page.svelte
@@ -138,7 +138,9 @@
 		<div class="font-bold flex justify-around items-center border-b pb-3 text-secondary">
 			{#each tabs.filter((t) => t.name !== 'shopify') as { name, key }}
 				<a href={`/${user.username}/settings/${name}`}>
-					<button class="hover:opacity-80" class:text-black={tab === name || (tab === "shopify" && name === "pos")}
+					<button
+						class="hover:opacity-80"
+						class:text-black={tab === name || (tab === 'shopify' && name === 'pos')}
 						>{$t(`user.settings.${key}`)}</button
 					>
 				</a>
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
index 34399ad5..47c4c4c6 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
@@ -64,28 +64,32 @@
 
 	$: url = `${$page.url.host}/${user.username}`;
 	$: full = `${$page.url.protocol}//${url}`;
-  $: addr = `${user.username}@${$page.url.host}`;
+	$: addr = `${user.username}@${$page.url.host}`;
 </script>
 
 <div>
 	<label for="username" class="font-bold mb-1 block">{$t('user.settings.username')}</label>
 	<div class="flex mb-2">
-    <input
-      type="text"
-      name="username"
-      bind:value={user.username}
-      class="border-r-0 rounded-r-none w-auto min-w-0 pr-1 grow"
-      />
-      <div class="text-gray-600 p-4 my-auto bg-gray-100 border border-r-0 pl-1">@{$page.url.host}</div>
-		<div class="text-gray-600 border-l-0 bg-gray-100 rounded-r-2xl p-4 my-auto border w-16" >
-      <a href={`/qr/${encodeURIComponent(addr)}`}>
-        <Icon icon="qr" style="invert" />
-      </a>
+		<input
+			type="text"
+			name="username"
+			bind:value={user.username}
+			class="border-r-0 rounded-r-none w-auto min-w-0 pr-1 grow"
+		/>
+		<div class="text-gray-600 p-4 my-auto bg-gray-100 border border-r-0 pl-1">
+			@{$page.url.host}
+		</div>
+		<div class="text-gray-600 border-l-0 bg-gray-100 rounded-r-2xl p-4 my-auto border w-16">
+			<a href={`/qr/${encodeURIComponent(addr)}`}>
+				<Icon icon="qr" style="invert" />
+			</a>
 		</div>
 	</div>
 
 	<div class="flex mb-2">
-    <div class="text-gray-600 rounded-l-2xl p-4 my-auto border bg-gray-100 pr-1">{$page.url.host}/</div>
+		<div class="text-gray-600 rounded-l-2xl p-4 my-auto border bg-gray-100 pr-1">
+			{$page.url.host}/
+		</div>
 		<input
 			type="text"
 			name="username"
@@ -93,9 +97,9 @@
 			class="grow border-l-0 rounded-l-none border-r-0 rounded-r-none w-auto pl-1 min-w-0"
 		/>
 		<div class="text-gray-600 rounded-r-2xl p-4 my-auto border bg-gray-100 w-16">
-      <a href={`/qr/${encodeURIComponent(full)}`}>
-        <Icon icon="qr" style="invert" />
-      </a>
+			<a href={`/qr/${encodeURIComponent(full)}`}>
+				<Icon icon="qr" style="invert" />
+			</a>
 		</div>
 	</div>
 </div>
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_pos.svelte b/src/routes/(app)/[username]/settings/[...tab]/_pos.svelte
index ef5b7869..057d8c20 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_pos.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_pos.svelte
@@ -33,7 +33,9 @@
 </div>
 
 <a href="./shopify">
-	<button class="flex rounded-full border py-2 px-4 font-bold hover:opacity-80 w-full gap-2 my-5 justify-center">
+	<button
+		class="flex rounded-full border py-2 px-4 font-bold hover:opacity-80 w-full gap-2 my-5 justify-center"
+	>
 		<img src="/icons/shopify.svg" class="w-8" />
 		<div class="my-auto">Shopify Integration</div>
 	</button>
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_security.svelte b/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
index a08785f6..c01db734 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
@@ -52,12 +52,12 @@
 		return true;
 	};
 
-let disablingPin = false;
+	let disablingPin = false;
 
 	let togglePin = async () => {
 		if (user.haspin) {
 			try {
-        disablingPin = true;
+				disablingPin = true;
 				await tick();
 				submit.click();
 			} catch (e) {
@@ -122,7 +122,7 @@ let disablingPin = false;
 	};
 </script>
 
-<input type="hidden" name="newpin" value={disablingPin ? "delete" : pin} />
+<input type="hidden" name="newpin" value={disablingPin ? 'delete' : pin} />
 <input type="hidden" name="confirm" bind:value={password} />
 
 <div class="relative mb-5">